<template>
  <div>
    <div class="small">

   <ul>
   <li > <van-swipe class="my-swipe" :autoplay="3000" indicator-color="white">
  <van-swipe-item><img src="../../../../public/moder/md11.jpg" alt="" class="a1"></van-swipe-item>
  <van-swipe-item><img src="../../../../public/moder/md12.jpg" alt="" class="a1"></van-swipe-item>
   </van-swipe>  </li>

    <li v-for="(v,i) in arr" :key="i">
       <img :src="v.img" class="a2"> 
       <p class="p1">{{v.name}} </p>
       <p class="p2">{{v.name1}}</p>
       <p class="p3"> <span>{{v.name2}}</span> </p>
       <p class="p4">{{v.name3}}</p>

    </li>
   </ul>




    </div>
  

  </div>
</template>

<script>
export default {
     data(){
   return {
      arr:[
        {name:"合租，天海花园 4室一厅 主卧" ,img:"./moder/hs.png",name1:"91*|4室一厅|西",name2:"精装修",name3:"￥1730/1月"},
        {name:"合租，天海花园 4室一厅 主卧" ,img:"./moder/hs1.png",name1:"91*|4室一厅|西",name2:"精装修",name3:"￥1730/1月"},
         {name:"合租，天海花园 4室一厅 主卧" ,img:"./moder/hs.png",name1:"91*|4室一厅|西",name2:"精装修",name3:"￥1730/1月"},
       
      ]

   }
  }
}
</script>

<style lang="less" scoped>
 .my-swipe .van-swipe-item {
    color: #fff;
    font-size: .2rem;
    line-height: 2.4rem;
    text-align: center;
    background-color: #39a9ed;
  }
  .small{
   width:90% ;
   margin: auto;
   margin-bottom:.5rem ;

   
    ul{
        width: 100%;
        display: flex;
        flex-wrap: wrap;
        justify-content: space-between;

        li{
            width: 48%;
            height:2.4rem ;
            margin-bottom: .1rem;
            border: 1px solid #f0f0f0 ;
            .a1{
                width: 100%;
                height: 2.4rem;
                display: block;
            }
            .a2{
                width:100% ;
                height:1rem ;
                display: block;
            }
            .p1{
                font-size: .14rem;
                font-weight: 600;
                line-height: .2rem;
                margin-top:.05rem ;

            }
            .p2{
                font-size: .1rem;
                line-height: .2rem;
            }
            .p3{font-size: .1rem;
            span{background-color:#f0f0f0;
            
            }  }
            .p4{
                font-size: .18rem;
                color: red;
                margin-top:.1rem ;
            }
        }
        
        
    }
   
  }
</style>